/**
* 作者 ：食草狂魔
*
* 日期 ：2017/11/30
*
* 描述 ：目录管理 - 编辑信息项
*/
<template>
  <el-container class="is-vertical">
    <HeaderBar :menuState="menuState"></HeaderBar>
    <BreadCrumb :options="breadOptions" class="breadcreamb"></BreadCrumb>
    <el-main class="editMain">
      <ModuleBar :title="moduleBarTitle" class="editModule"></ModuleBar>
      <el-form label-position="right" label-width="120" style="margin-top: 20px;">
        <el-row>
          <el-col :span="12">
            <el-form-item class="infor" label="信息资源分类 :">
              <p>{{ ruleForm.dirName }}</p>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item class="infor"  label="提供方名称或代码 :">
              <p>{{ ruleForm.departmentName }}</p>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item class="infor" label="信息资源名称 :">
              <p>{{ ruleForm.name }}</p>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item class="infor"  label="信息资源代码 :">
              <p>{{ ruleForm.code }}</p>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <MTable :options="tableOptions" ref="myTable" class="tablebar"></MTable>
          <el-button @click="submitForm('ruleForm')" class="elButton moduleButton">完成</el-button>
        </el-row>
      </el-form>
    </el-main>
    <Dialog :options="dialogOptions">
      <AddCatalogForm slot="dialogContent" :parentModel="viewModel" v-if="dialogOptions.visible"></AddCatalogForm>
    </Dialog>
    <Dialog :options="dialogOptions2">
      <UpdateCatalogForm slot="dialogContent" :parentModel="viewModel" :updateFormData="updateFormData" v-if="dialogOptions2.visible"></UpdateCatalogForm>
    </Dialog>
    <Dialog :options="dialogOptions3">
      <ShowCatalogForm slot="dialogContent" :parentModel="viewModel" :updateFormData="updateFormData" v-if="dialogOptions3.visible"></ShowCatalogForm>
    </Dialog>
  </el-container>
</template>

<script>
    import config from '../../config/config'
    import dirAPIs from '../../api/dirAPIs'
    import HeaderBar from '../../components/header/Header.vue'
    import BreadCrumb from '../../components/breadcrumb/BreadCrumb.vue'
    import ModuleBar from '../../components/modulebar/ModuleBar.vue'
    import MTable from '../../components/table/Table.vue'
    import Dialog from '../../components/Dialog/Dialog.vue'
    import AddCatalogForm from './components/addCatalogForm/AddCatalogForm.vue'
    import UpdateCatalogForm from './components/updateCatalogForm/UpdateCatalogForm.vue'
    import ShowCatalogForm from './components/showCatalogForm/ShowCatalogForm.vue'

    export default {
    	name:"editInfoProperty",
      components: {
        HeaderBar,
        BreadCrumb,
        ModuleBar,
        MTable,
        Dialog,
        AddCatalogForm,
        UpdateCatalogForm,
        ShowCatalogForm
      },
    	data () {
	      return {
	        title: "目录管理--编辑信息资源内容",
	        menuState: '/catalogManage/main',
	        input: '',
	        value:'',
	        moduleBarTitle:"编辑信息项内容",
	        breadOptions:{
	        	bread:[
              {
                label:"政务数据资源管理系统",
                path:"/"
              },{
                label:"目录管理",
                path:"/catalogManage/main"
              },{
                label:"编辑信息项内容",
                path:"/catalogManage/term"
              }
	        	]
	        },
	        options: [],
          ruleForm: {
            name: '',
            code:'',
            departmentName: '',
            dirName: ''
          },
          tableOptions: {
            handleSelectionChange (rows) {
            }
          },
          dialogOptions: {
            visible: false,
            title: "添加信息项"
          },
          dialogOptions2: {
            visible: false,
            title: "编辑信息项"
          },
          dialogOptions3: {
            visible: false,
            title: "查看信息项"
          },
          infoResourceId: this.$router.history.current.query.infoResourceId,
          viewModel: this, // 当前作用域
          updateFormData: {},
          tableRows: []
	      }
	    },
	    mounted: function () {
    		let vm = this

//        vm.initTable([],1,20,0)
        vm.loadInfoData()
        vm.loadInfoPropertyData({
          token: localStorage.token,
          infoResourceId: vm.infoResourceId,
          pageNum: 1,
          pageSize: 20
        })
		  },
    	methods: {
    	  // 加载信息资源详情
    	  loadInfoData () {
    	    let vm = this
          dirAPIs.infoResourceRead({
            token: localStorage.token,
            key: vm.infoResourceId
          }).then(({ data }) => {
            if(data.code == 10000) {
              vm.ruleForm = data.data
            }
          })
        },
        // 加载信息资源下的信息项
        loadInfoPropertyData (params) {
          let vm = this
          dirAPIs.infoPropertyList(params).then(({ data }) => {
            if(data.code == 10000) {
//              debugger
              vm.initTable(data.data, 1, 20, data.total)
            }
          })
        },
	    	submitForm(formName) {
          this.$router.push({path: '/catalogManage/main'});
		    },
        initTable (dataList, pageNo, pageSize, total) {
          let vm = this
          vm.tableOptions = {
            thead: [{
              prop: "propertyName", // 数据的key值
              label: "信息项名称", // 显示的标题
              width: "120" // 列宽
            },{
              prop: "infoPropertyDataTypeName", // 数据的key值
              label: "数据项类型", // 显示的标题
              width: "120" // 列宽
            },{
              prop: "propertyDataLength", // 数据的key值
              label: "数据长度", // 显示的标题
              width: "120" // 列宽
            },{
              prop: "shareType", // 数据的key值
              label: "共享类型", // 显示的标题
              width: "120", // 列宽
              formatter (row, column, cellValue) {
                switch (cellValue) {
                  case 1 :
                    return "不共享"
                    break
                  case 2 :
                    return "有条件共享"
                    break
                  case 3 :
                    return "无条件共享"
                    break
                }
              }
            },{
              prop: "infoPropertyShareModeName", // 数据的key值
              label: "共享方式", // 显示的标题
              formatter (row, column, cellValue) {
                return cellValue.replace(",","-")
              }
            },{
              prop: "isOpen", // 数据的key值
              label: "开放类型", // 显示的标题
              width: "120", // 列宽
              formatter (row, column, cellValue) {
                switch (cellValue) {
                  case 1 :
                    return "不开放"
                    break
                  case 2 :
                    return "有条件开放"
                    break
                  case 3 :
                    return "无条件开放"
                    break
                }
              }
            },{
              prop: "openContent", // 数据的key值
              label: "开放条件", // 显示的标题
              width: "120" // 列宽
            },{
              prop: "updateCycle", // 数据的key值
              label: "更新周期", // 显示的标题
              width: "120", // 列宽
              formatter (row, column, cellValue) {
                switch (cellValue) {
                  case 1 :
                    return "实时"
                    break
                  case 2 :
                    return "每日"
                    break
                  case 3 :
                    return "每周"
                    break
                  case 4 :
                    return "每季度"
                    break
                  case 5 :
                    return "每半年"
                    break
                  case 6 :
                    return "每年"
                    break
                  case 7 :
                    return "其他"
                    break
                }
              }
            },{
              prop: "releaseTime", // 数据的key值
              label: "发布日期", // 显示的标题
              width: "120", // 列宽
              formatter (row, column, cellValue) {
                return new Date(parseInt(cellValue)).toLocaleDateString()
              }
            },{
              prop: "description", // 数据的key值
              label: "备注", // 显示的标题
              formatter (row, column, cellValue) {
                if(cellValue == "undefined"){
                	return ""
                }else{
                	return cellValue
                }
              }
            }],
            operation:{
              fixed: "right",
              width: 150,
              items: [{
                xtype: "link",
                buttonType: "danger", // 按钮样式
                buttonText: "删除",
                style: "color:red;",
                onClick (i, row) {
                  dirAPIs.infoPropertyDelete({
                    token: localStorage.token,
                    key: row.infoPropertyId
                  }).then(({ data }) => {
                    if(data.code == 10000) {
                      vm.$message.success("信息项删除成功！")
                      vm.loadInfoPropertyData({
                        token: localStorage.token,
                        infoResourceId: vm.infoResourceId,
                        pageNum: 1,
                        pageSize: 20
                      })
                    }
                    else{
                      vm.$message.error("信息项删除失败！")
                    }
                  })
                }
              },{
                xtype: "link",
                buttonType: "danger", // 按钮样式
                buttonText: "修改",
                onClick (i, row) {
                  vm.dialogOptions2.visible = true
                  vm.updateFormData = row
                }
              },{
                xtype: "link",
                buttonType: "primary", // 按钮样式
                buttonText: "查看",
                onClick (i, row) {
                  vm.dialogOptions3.visible = true
                  vm.updateFormData = row
                }
              }]
            },
            data: dataList,
            handleSelectionChange (rows) {
              vm.tableRows = rows
            },
            selection: {
              width: 55
            },
            toolbar: [{
              xtype: "toolbarRow",
              items: [{
                xtype: "button",
                buttonType: "primary", // 按钮样式
                buttonText: "添加",
                className: "",
                style:"width:100px;background: #076dc1;margin-right:20px;padding:0",
                onClick () {
                  vm.dialogOptions.visible = true
                }
              },{
                xtype: "button",
                buttonType: "primary", // 按钮样式
                buttonText: "删除",
                className: "",
                style:"width:100px;background: #076dc1;margin-right:20px;padding:0",
                onClick () {
                  let arr = []
                  vm.tableRows.forEach(item => {
                    arr.push(item.infoPropertyId)
                  })
                  dirAPIs.infoPropertyDelete({
                    token: localStorage.token,
                    key: arr.join(",")
                  }).then(({ data }) => {
                    if(data.code == 10000){
                      vm.$message.success("删除信息项成功！")
                      vm.loadInfoPropertyData({
                        token: localStorage.token,
                        infoResourceId: vm.infoResourceId,
                        pageNum: 1,
                        pageSize: 20
                      })
                    }
                    else{
                      vm.$message.error("删除信息项失败！")
                    }
                  })
                }
              },{
                xtype: "button",
                buttonType: "primary", // 按钮样式
                buttonText: "导出",
                className: "",
                containerStyle:"float:right",
                style:"width:100px;background: #076dc1;margin-right:20px;padding:0",
                onClick () {
                  window.open(`${config.siteInfo.sites.file_server_url}/dir/infoResourceExport?token=${localStorage.token}`)
                }
              },{
                xtype: "upload",
                buttonType: "primary", // 按钮样式
                buttonText: "导入",
                containerStyle:"float:right",
                style:"width:100px;background: #076dc1;margin-right:20px;padding:0",
                action: `${config.siteInfo.sites.file_server_url}/dir/infoPropertyImport?token=${localStorage.token}`, //"/test",//`${$config.siteInfo.sites.file_server_url}/dir/infoResourceImport`,
                data: {
                  infoResourceId: vm.infoResourceId,
                  token: localStorage.token
                },
                ref: "uploadBtn",
                onSuccess (response, file, fileList) {
                  // 此处，拿到服务器返回信息，渲染表格数据
                  if(response.code == 10000) {
                    vm.$message.success("导入成功！")
                    vm.loadInfoPropertyData({
                      token: localStorage.token,
                      infoResourceId: vm.infoResourceId,
                      pageNum: 1,
                      pageSize: 20
                    })
                  }
                  else{
                    vm.$message.error("导入失败！")
                  }
                }
              }]
            }]
          }
        }
    	}
    }
</script>

<style>
	.resMain{
		width: 75%;
		line-height: normal;
		margin: 0 auto 90px;
	}
	/*.resMain .resStep .el-step__arrow{
		display: none;
	}*/
	.resStep{
		padding: 0 8%;
		height: 40px;
	}
	.resForm{
		padding: 60px 10% 0 10%;
		border: 1px solid #d8d6d6;
		border-top: none;
	}
	.resForm label{
		font-weight: bold;
	}
	.resForm .el-form-item__content{
		margin-left: 220px !important;
		text-align: left;
	}
	.resForm .el-textarea__inner{
		min-height: 140px !important;
	}
	.resources{
		overflow: hidden;
	}
	.resources .infor{
		width: 50%;
		float: left;
		position: relative;
	}
	.resForm .elRelation{
		width: auto;
	}
	.resources .el-input__inner{
		height: 36px;
	}
	.catalogG{
		width: 36px;
		height: 36px;
		color:#fff;
		display: block;
		font-size: 1.6rem;
		background: #2cace2;
		border-radius: 3px;
		text-align: center;
		line-height: 36px;
		position: absolute;
		top: 4px;
		right: 0;
	}
	.catalogSlip{
		width: 50px;
	}
	.resForm .elButton,.editMain .elButton{
		margin: 40px 0 60px 0;
		width: 112px;
		height: 36px;
	}
	.resForm .elRight,.editMain .elRight{
		margin-right: 60px;
	}
	.inforNum{
		overflow: hidden;
	}
	.inforNum p{
		float: left;
	}
	.inforNum .el-input{
		float: left;
		width: 140px;
	}
	.inforNum span{
		float: left;
	}
	.resForm .el-select{
		float: left;
		width: 140px;
		margin-right: 10px;
	}
	.editMain{
		width: 84%;
		line-height: normal;
		margin: 0 auto 90px;
		padding: 0;
	}
	.editMain .adminForm{
		border: 1px solid #d8d6d6;
		border-top: none;
		padding:30px 5%;
	}
	.editStep{
		padding: 0 8%;
		height: 40px;
	}
	.toolbarItem button{
		width: 84px;
		height: 36px;
	}
	.editMain .editModule{
		width: 100%;
		text-align: center;
	}
</style>
